<div class="mat-padding" fxLayout="column">
  <form [formGroup]="entityForm">
    <fieldset [disabled]="(isLoading$ | async) || !isEdit">
      <mat-form-field class="mat-block">
        <mat-label translate>video.name</mat-label>
        <input matInput formControlName="name" required>
        <mat-error *ngIf="entityForm.get('name').hasError('required')">
          {{ 'video.name-required' | translate }}
        </mat-error>
      </mat-form-field>

      <mat-form-field class="mat-block">
        <mat-label translate>video.ip</mat-label>
        <input matInput formControlName="ip" required>
        <mat-error *ngIf="entityForm.get('ip').hasError('required')">
          {{ 'video.name-required' | translate }}
        </mat-error>
      </mat-form-field>

      <mat-form-field class="mat-block">
        <mat-label translate>video.camera-id</mat-label>
        <input matInput formControlName="cameraId" required>
        <mat-error *ngIf="entityForm.get('cameraId').hasError('required')">
          {{ 'video.name-required' | translate }}
        </mat-error>
      </mat-form-field>
    </fieldset>
  </form>
</div>